이벤트 버블링 💻 TIL 16 | 이벤트 버블링과 이벤트 위임 위의 예시에서 보이듯 <em>을 클릭했음에도 <div>에 할당한 핸들러가 동작한다. 바로 이벤트 버블링 때문이다. 이벤트 버블링 한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작한다. 가장 최상단의 조상 요소를 만날 대까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작한다. 1. 우선 <p>에 할당된 onclick이 동작한다. 2.... 데브코스프로그래머스TIL이벤트 버블링이벤트 위임TIL DEEP DIVE 두 장 요약 (이벤트 ⑵ , event) 이벤트 핸들러가 바인딩된 DOM 요소 내가 클릭한 이벤트 객체를 동적으로 가리키는 ① e.target은 querySelector로 선택한 $checkbox를 가리키고 있기 때문에 그대로 해당 요소 태그를 보여줍니다. 내가 클릭한 이벤트 객체의 타깃의 현재 제일 상위 태그를 나타내는 ② currentTarget은 querySelector로 선택한 $checkbox가 제일 상위 태그이므로 해당 ... JavaScriptjs이벤트 전파Eventdeep dive이벤트 캡처링이벤트 위임이벤트 버블링이벤트 타깃Event
💻 TIL 16 | 이벤트 버블링과 이벤트 위임 위의 예시에서 보이듯 <em>을 클릭했음에도 <div>에 할당한 핸들러가 동작한다. 바로 이벤트 버블링 때문이다. 이벤트 버블링 한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작한다. 가장 최상단의 조상 요소를 만날 대까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작한다. 1. 우선 <p>에 할당된 onclick이 동작한다. 2.... 데브코스프로그래머스TIL이벤트 버블링이벤트 위임TIL DEEP DIVE 두 장 요약 (이벤트 ⑵ , event) 이벤트 핸들러가 바인딩된 DOM 요소 내가 클릭한 이벤트 객체를 동적으로 가리키는 ① e.target은 querySelector로 선택한 $checkbox를 가리키고 있기 때문에 그대로 해당 요소 태그를 보여줍니다. 내가 클릭한 이벤트 객체의 타깃의 현재 제일 상위 태그를 나타내는 ② currentTarget은 querySelector로 선택한 $checkbox가 제일 상위 태그이므로 해당 ... JavaScriptjs이벤트 전파Eventdeep dive이벤트 캡처링이벤트 위임이벤트 버블링이벤트 타깃Event